<template>
	<view style="padding: 100rpx 80rpx;">
		<view style="font-size: 40rpx;font-family: PingFang SC;font-weight: 500;color: #000000;margin-bottom: 40rpx;">
			请输入验证码
		</view>
		<view style="font-size: 24rpx;font-family: PingFang SC;font-weight: 500;color: #888888;">
			验证码已发送至 {{phone}}
		</view>
		<view class="content" style="margin-top: 30rpx;">
		        <verification-code-style borderStyle="border-bottom:1px solid gray;width:80rpx" borderCheckStyle="border-bottom:1px solid #DFB993;width:80rpx"
		         :latticeNum="6" @getInputVerification="getInputVerification"></verification-code-style>
		</view>
		<view v-if="second > 0" style="font-size: 24rpx;font-family: PingFang SC;font-weight: 500;color: #888888;margin-top: 40rpx;">
			剩余<text>{{second}}</text>s
		</view>
		<view @click="VerificationCodeClick()" v-if="second == 0" style="font-size: 24rpx;font-family: PingFang SC;font-weight: 500;color: #888888;margin-top: 40rpx;">
			请重新获取验证码
		</view>
	</view>
</template>

<script>
	import verificationCodeStyle from '@/components/verification-code-style2/verification-code-style2'
	export default {
		components: {
			verificationCodeStyle 
		},
		data() { 
			return {
				phone:'',
				captcha:'',
				second:60
			}
		},
		onLoad(options) {
		    // console.log(options.id);
			var that = this;
			this.phone = options.phone;
		},
		onShow() {
			var that = this;
			var interval = setInterval(function(){
				that.second--;
			}, 1000)
			setTimeout(function(){
				that.second = 0;
				clearInterval(interval);
			}, 60000)
		},
		mounted() {
			
		},
		methods: {
			VerificationCodeClick(){
				uni.reLaunch({
				    url: '../second/Sign'
				});
			},
			getInputVerification(e){
				var that = this;
			    console.log(e);
				this.captcha = e;
				var i = e
				var r=0;
				while(i >= 1){
				 	i=i/10;
				 	r++;
					if(r == 6){
						this.SignIn();
					}
				}
			},
			SignIn(){
				var that = this;
				this.$H.post('moblie/login', {
					phone: that.phone,
					captcha:that.captcha
				}, {
					native: false
				}).then(res => {
					if(res.status == 200){
						uni.setStorage({
							key: 'time',
							data: res.data.expires_time,
						})
						uni.setStorage({
							key: 'token',
							data: res.data.token,
							success() {
								//返回上一页
								// uni.navigateBack();
								// self.location = document.referrer;
								uni.switchTab({
									url: '/pages/index/index'
								});
							}
						})
		
					}else{
						uni.showToast({
						    title: res.msg,
							icon:'none',
						    duration: 2000
						});
					}
				})
			}
		}
	}
</script>

<style>
</style>
